import 'package:flutter/material.dart';
import 'dart:ui';
import 'animate_page.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ScaleAnimationRoute(title: '图片放大'),
    );
  }
}

class ScaleAnimationRoute extends StatefulWidget {
  const ScaleAnimationRoute({Key key, this.title}) : super(key: key);
  final String title;

  @override
  State<StatefulWidget> createState() {
    return ScaleAnimationRouteState();
  }
}

// 需要继承TickerProvider
// 如果有多个AnimationController，则应该使用TickerProviderStateMixin。
class ScaleAnimationRouteState extends State<ScaleAnimationRoute>
    with SingleTickerProviderStateMixin {
  Animation<double> animation;
  AnimationController controller;

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    controller = new AnimationController(
        duration: const Duration(seconds: 3), vsync: this);

    // 没有指定Curve，默认匀速
    //图片宽高从0到300
    // animation = new Tween(begin: 0.0, end: window.physicalSize.width)
    //     .animate(controller)
    //     ..addListener(() {
    //   setState(() => {});
    // });

    // 指定一个Curve，实现类似弹簧效果的动画过程
    //使用弹性曲线
    animation = CurvedAnimation(parent: controller, curve: Curves.bounceIn);
    animation =
        new Tween(begin: 0.0, end: window.physicalSize.width).animate(animation)
          ..addListener(() {
            setState(() => {});
          });

    controller.addStatusListener((state) {
      switch (state) {
        case AnimationStatus.dismissed:
          print('动画在起始点停止');
          controller.forward();
          break;
        case AnimationStatus.forward:
          print('动画正在正向执行');
          break;
        case AnimationStatus.reverse:
          print('动画正在反向执行');
          break;
        case AnimationStatus.completed:
          print('动画在终点停止');
          controller.reverse();
          break;
        default:
      }
    });

    //启动动画(正向执行)
    controller.forward();
  }

  @override
  void dispose() {
    //路由销毁时需要释放动画资源
    controller.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
          child: Column(
        crossAxisAlignment: CrossAxisAlignment.center,
        children: <Widget>[
          Expanded(
              child: Container(
                  alignment: Alignment.center,
                  child: Image.asset(
                    'assets/images/food05.jpeg',
                    width: animation.value,
                    fit: BoxFit.fitWidth,
                  ))),
          Padding(
            padding: EdgeInsets.only(bottom: 100),
            child: RaisedButton(
              child: Text('简化'),
              onPressed: () {
                // Navigator.push(context,
                //     new MaterialPageRoute(builder: (context) {
                //   return TestRoute();
                // }));
                Navigator.push(
                    context,
                    PageRouteBuilder(
                        transitionDuration:
                            Duration(milliseconds: 500), //动画时间为500毫秒
                        pageBuilder: (BuildContext context, Animation animation,
                            Animation secondaryAnimation) {
                          return new FadeTransition(
                              //使用渐隐渐入过渡,
                              opacity: animation,
                              child: TestRoute() //路由B
                              );
                        }));
              },
            ),
          )
        ],
      )),
    );
  }
}
